<div nz-row class="login">
    <div nz-col nzSpan="8"></div>
    <div nz-col nzSpan="8">
        <div class="login-container">
            <nz-spin [nzSpinning]="isBusy">
                <nz-card nzTitle="统一身份认证系统" style="height: 270px">
                    <form nz-form [formGroup]="formGroup">
                        <nz-form-item>
                            <nz-form-label [nzSpan]="4">用户名</nz-form-label>
                            <nz-form-control [nzSpan]="20" [nzErrorTip]="loginIdError">
                                <input nz-input nzSize="large" type="text" formControlName="loginId"
                                       [(ngModel)]="loginId">
                                <ng-template #loginIdError let-control>
                                    <ng-container *ngIf="control.hasError('required')">
                                        用户名不可为空！
                                    </ng-container>
                                </ng-template>
                            </nz-form-control>
                        </nz-form-item>
                        <nz-form-item>
                            <nz-form-label [nzSpan]="4">密码</nz-form-label>
                            <nz-form-control [nzSpan]="20" [nzErrorTip]="passwordError">
                                <input nz-input nzSize="large" type="password" formControlName="password"
                                       [(ngModel)]="password"/>
                                <ng-template #passwordError let-control>
                                    <ng-container *ngIf="control.hasError('required')">
                                        密码不可为空！
                                    </ng-container>
                                </ng-template>
                            </nz-form-control>
                        </nz-form-item>
                    </form>
                    <div class="form-footer">
                        <button type="submit" nz-button nzType="primary" [nzLoading]="isBusy" (click)="login()">
                            登录
                        </button>
                    </div>
                </nz-card>
            </nz-spin>
        </div>
    </div>
    <div nz-col nzSpan="8"></div>
</div>
